{% extends "base.html" %}
{% block content%}
<script type="text/javascript">
<!--
  $(document).ready(function(){
    {% if link %}
      $('#link').val('{{link}}');
      get_info();
    {% endif%}
  });

	function get_info() {
		before_get();
		
		$.ajax({
			type: "GET",
			url: "/share/get",
			data : "link=" + $('#link').val(),
			success: function(msg) {
				get_success(msg);
			}
		});
	}

	function before_get() {
		$('#btn_get_info').attr("disabled","disabled");
	}

	function after_get() {
		$('#btn_get_info').removeAttr("disabled");
	}

	function get_success(msg) {
		var link_info = eval('(' + msg + ')');
		$('#name').val(link_info.name);
		$('#title').val(link_info.title);
		$('#description').val(link_info.title);

		pictures = link_info.pictures;
		pictures = pictures.split('|');
		
		div_images = $('#pictures');
		div_images.html('');
		for(key in pictures) {
			picture = pictures[key];
			$('<img>').addClass('info-image').attr('src', picture).appendTo(div_images);
		}

		if(pictures.length > 0)
			$('#picture').val(pictures[0]);

		$(".info-image").click(function(){
			select_picture($(this).attr('src'));
		})
		after_get();
	}

	function select_picture(src) {
		$('#picture').val(src);
		$('#picture_selected').attr('src', src).css('height', 100);
	}
//-->
</script>
	<h3>分享站点</h3>
	<div class="content" id="share-content">
		<form method="post" action="/share/create/share">
			<p>连接 : <input type="text" name="link" id='link'><input id='btn_get_info' type="button" value="获取信息" onclick="get_info()"></p><br>
			<p>标题 : <input type='text' name='title' id='title' required title='中文名称'></p><br>
			<p>描述 : <textarea name="description" id='description' rows="10" cols="100"  title='描述'></textarea></p><br>
			<p>分类 : 
				{% for category in categories %}
					<input type="checkbox" name="categories" value='{{category.name}}'><span class='info-category'>{{category.title}}</span>
				{% endfor %}
			</p><br>
			<input type='hidden' name='picture' id='picture'>
			<p><input type='submit' value='GO'></p><br>
			<p>图片<img id='picture_selected' src='' /></p>
			<div id='pictures' class='info-images'>
				
			</div>
		</form>
	</div>
{% endblock %}